<template>
	<view class="myWallet__heard" :style="{background: !isTrue ? 'transparent' : ScrollTopColor,height: `${search.top+search.height+10}px`}">
		<view class="myWallet__leftLogoBox" @click.stop="goBack">
			<image :src="mystate==2 ? '/static/images/leftIcon_action.png' : '/static/images/leftIcon.png' "
				:style="{ height: `${search.height}px`,width: `${search.height}px`}"></image>
		</view>
		<view class="myWallet__title"
			:style="{top: `${search.top}px`,height: `${search.height}px`,lineHeight: `${search.height}px`,color: mystate==2 ? '#FFF':'#000'}">{{title}}</view>
	</view>
</template>

<script>
	export default {
		props:{
			search:{
				type: Object,
				default:{}
			},
			title:{
				type: String,
				default:''
			},
			mystate:{
				type: Number,
				default:1
			},
			isTrue:{
				type: Boolean,
				default:true
			},
			ScrollTopColor:{
				type: String,
				default: '#F7F8FC'
			},
		},
		data() {
			return {}
		},
		methods: {
			goBack(){
				this.$emit('goPath')
			}

		}
	}
</script>

<style scoped lang="scss">
	.myWallet__heard {
		width: 100%;
		display: flex;
		position: fixed;
		z-index: 999;
		top: 0;
		left: 0;
		transition: all .5s;
	}

	.myWallet__leftLogoBox {
		position: absolute;
		bottom: 0;
		left: 0;
		width: 140rpx;
		flex: 0 0 140rpx;
		height: 100%;
		z-index: 99;
		

		image {
			width: 72rpx !important;
			height: 72rpx !important;
			position: absolute;
			bottom: 20rpx;
			left: 32rpx;
		}

	}

	.myWallet__title {
		width: 100%;
		text-align: center;
		position: absolute;
		font-size: 16px;
		font-family: 蘋方-簡;
		font-weight: bold;
		line-height: 22px;
		color: #000000;
	}
</style>
